<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>粤亮旅游网</title>
  <link rel="stylesheet" href="../css/common.css">
  <!-- 引入favicon图标 -->
  <link rel="shortcut icon" href="../favicon.ico" />
  <!-- 引入首页css -->
  <link rel="stylesheet" href="../css/index.css">
  <!-- 引入字体图标 -->
  <script src="../js/jquery-3.3.1.js"></script>
  <style>
    @font-face {
      font-family: 'icomoon';
      src: url('fonts/icomoon.eot?rghiog');
      src: url('fonts/icomoon.eot?rghiog#iefix') format('embedded-opentype'),
        url('fonts/icomoon.ttf?rghiog') format('truetype'),
        url('fonts/icomoon.woff?rghiog') format('woff'),
        url('fonts/icomoon.svg?rghiog#icomoon') format('svg');
      font-weight: normal;
      font-style: normal;
      font-display: block;
    }
  </style>

</head>

<body>
  <!-- 快捷导航栏开始 -->
  <section class="shortcut">
    <div class="top-bgc">
      欢迎来到粤亮旅游网!
    </div>
    <div class="w">
      <div class="mine">
        <ul>
          <li class="fl">
            <a href="collect.html">我的收藏</a>
            <a href="orders.html" style="padding: 0 10px ">我的订单</a>
            <a href="#" class="logout">退出</a>
          </li>
          <li class="fr">
            <a href="login.html">请登录</a> &nbsp;
            <a href="register.html" class="style_red">免费注册</a>
          </li>
        </ul>
      </div>

    </div>
  </section>
  <div class="header w">
    <div class="logo">

    </div>
    <div class="search">
      <input type="search" name="" id="" placeholder="请输入目的地">
      <button></button>
    </div>
    <div class="cs-phone">
      <img src="../images/hot-tel.jpg" alt="">
      <div class="kefu">客服热线(9:00-6:00)</div>
      <div class="phone">400-618-9090</div>


    </div>
  </div>

  <!-- 导航栏 -->
  <div class="nav w">
    <ul>
      <li><a href="#" style="color: skyblue; font-size: 30px;">首页</a></li>
      <li><a href="#">分类</a></li>
      <li><a href="#">旅游套餐</a></li>
      <li><a href="train.html">火车票</a></li>
      <li><a href="hotel.html">酒店</a></li>
      <li><a href="#">租车</a></li>
      <li><a href="#">活动</a></li>
      <li><a href="#">购物车</a></li>
      <li><a href="#">优惠券</a></li>
    </ul>
  </div>
  <!-- 快捷导航栏开始 -->

  <!-- 核心内容部分 -->
  <div class="content w">
    <!-- 轮播图 -->
    <div class="slider">
      <!-- 轮播图核心图片部分 -->
      <div class="slider-wrapper">
        <img src="../images/slider01.jpg" alt="" />
        <!-- 左右按钮 -->
      </div>
      <button class="slider-lbutton slider-button prev"></button>
      <button class="slider-rbutton slider-button next"></button>
      <div class="slider-footer">
        <!-- 文字提示部分 -->
        <p>广州</p>
        <ul class="slider-indicator">
          <!-- 小圆点 -->
          <li class="active"></li>
          <li></li>
          <li></li>
          <li></li>
          <li></li>
          <li></li>
          <li></li>
          <li></li>
        </ul>
        <!-- 上一张,下一张按钮 -->
        <!-- <div class="toggle">
          <button class="prev">&lt;</button>
          <button class="next">&gt;</button>
        </div> -->
      </div>
    </div>


    <!-- 智慧旅游 -->
    <div class="smart-trip">
      <div class="tit">智慧旅游</div>
      <div class="map">

      </div>
    </div>

    <!-- 旅行盲盒开始 -->
    <div class="trip-blindbox">
      <div class="tit">旅行盲盒</div>
      <div class="map-box">
        <img src="../nnImg/广州.png" alt="" class="map-img">
        <div class="city-name">广州</div>
      </div>
      <div class="mine">
        <div class="my-location">
          <label class="loc-tit">我的位置:</label>
          <input type="text" class="location">
        </div>
        <div class="departure">
          <label class="date-tit">出发日期:</label>
          <input type="date" class="departure-date">
        </div>
        <div class="fees">
          <label for="" class="fee-tit">总费用:</label>
          <div class="moneys">
            <span class="icon">¥</span>
            <span class="money">0</span>
          </div>
        </div>
        <button class="button">开始</button>
        <div class="choice">
          <div class="scheduled-train">
            <div class="square hook-train"></div>
            <span>预定火车票</span>
          </div>
          <div class="scheduled-hotel">
            <div class="square hook-hotel"></div>
            <span>预定酒店</span>
          </div>
        </div>
      </div>

    </div>


    <!-- 旅行盲盒结束 -->
    <!--  -->

  </div>



  <!-- 底部模块的制作 start -->
  <footer class="footer">
    <div class="w">
      <div class="mod_service">
        <ul>
          <li>
            <h5></h5>
            <div class="service_txt">
              <h4>价格保证</h4>
              <p>同类产品,保证低价</p>
            </div>
          </li>
          <li>
            <h5></h5>
            <div class="service_txt">
              <h4>退订保障</h4>
              <p>因特殊情况影响出行,保证退订</p>
            </div>
          </li>
          <li>
            <h5></h5>
            <div class="service_txt">
              <h4>救援保障</h4>
              <p>旅途中意外情况,保证援助</p>
            </div>
          </li>
          <li>
            <h5></h5>
            <div class="service_txt">
              <h4>贴心服务</h4>
              <p>快速响应,全年无休</p>
            </div>
          </li>
        </ul>
      </div>
      <div class="mod_help">
        <dl>
          <dt>关于我们</dt>
          <dd><a href="#">粤亮简介</a></dd>
          <dd><a href="#">旅游度假资质</a></dd>
          <dd><a href="#">网络地图</a></dd>
          <dd><a href="#">诚聘英才</a></dd>
          <dd><a href="#">知识产权声明</a></dd>
          <dd><a href="#">用户协议</a></dd>
        </dl>
        <dl>
          <dt>加盟合作</dt>
          <dd><a href="#">团购预约</a></dd>
          <dd><a href="#">分销系统</a></dd>
          <dd><a href="#">平台开放</a></dd>
          <dd><a href="#">供应商结盟合作</a></dd>
        </dl>
        <dl>
          <dt>联系我们</dt>
          <dd><a href="#">门店信息</a></dd>
          <dd><a href="#">意见反馈</a></dd>
          <dd><a href="#">不良信息处置方法</a></dd>

        </dl>
        <dl>
          <dt>订购指南</dt>
          <dd><a href="#">门票使用</a></dd>
          <dd><a href="#">常见问题</a></dd>
        </dl>

        <dl>
          <dt>售后服务</dt>
          <dd><a href="#">退货说明</a></dd>
          <dd><a href="#">投诉建议</a></dd>
        </dl>
        <dl>
          <dt>帮助中心</dt>
          <dd>
            <img src="../images/了解更多.png" alt="">
            粤亮客户端
          </dd>
        </dl>
      </div>
      <div class="mod_copyright">
        <div class="links">
          <a href="#">关于我们</a> | <a href="#">联系我们</a> | 联系客服 | 商家入驻 | 营销中心 | 手机粤亮 | 友情链接 | 销售联盟 | 粤亮社区 |
          品优购公益 | English Site | Contact U
        </div>
        <div class="copyright">
          地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn <br>
          京ICP备08001421号京公网安备110108007702
        </div>
      </div>
    </div>
  </footer>
  <script src="../js/jquery-3.3.1.js"></script>
  <script src="../js/index.js"></script>
  <script>
    let responseData = localStorage.getItem('responseData');
    responseData = JSON.parse(responseData)

    if (responseData){
      document.querySelector('.fr').innerHTML = `<span>欢迎回来,${responseData.username}</span>`
    }

    const logout = document.querySelector('.logout')
    logout.addEventListener('click',function (){
      $.ajax({
        url: "/logout",
        type: "POST",
        contentType: "application/json",
        success: function (response) {
          // 处理响应
          if (response.success === 1) {
            alert("退出成功");
            localStorage.removeItem('responseData');
            localStorage.removeItem('hotelDetail')
            localStorage.removeItem('cityData')
            localStorage.removeItem('queryTickets')
            // 进行跳转或其他操作
            window.location.href = 'index.html'
          } else{
            alert("退出失败");
          }
        },
        error: function () {
          alert("请求失败");
        }
      });
    })
  </script>

</body>

</html>